import React from "react";
import classNames from 'classnames';
import { getView } from "../component";
import "../content/view/index.less";

export default class FieldView extends React.Component {
  render() {
    const { field, ...rest } = this.props;
    const ComponentView = getView(field.type);
    
    if (!ComponentView) return ComponentView;
    
    const type = field.config.complex ? 'complex' : 'single';
    const clsNameStr = classNames(`wea-edc-form-item wea-edc-${type}-field`, {
      hide: !field.visible
    });

    return (
      <div data-id={field.uuid} className={clsNameStr}>
        <ComponentView
          type={field.type}
          value={field.value}
          data={field.config}
          {...rest}
        />
      </div>
    );
  }
}

FieldView.defaultProps = {
  onChange: () => { }
};